@charset "utf-8";
@import "reset";
@import "common";

.wrap{
    main{
        .shop-class{
            .four-class{
                display: flex;
                justify-content: space-around;
                .class-pic{
                    img{
                        width: vw(148);
                    }
                    p{
                        margin-top: vw(8);
                        text-align: center;
                    }
                }
            }
            .class-point{
                display: flex;
                justify-content: center;
                .point{
                    width: vw(19);
                    height: vw(19);
                    background-color: #FFC9A1;
                    border-radius: 50%;
                    margin: vw(16) vw(6) 0;
                    cursor: pointer;
                    :active{
                        background-color:$color;
                    }
                }
            }
        }
        .delicious{
            @extend %big ;
        }
        .sports{
            margin-top:vw(52);
            @extend %big ;
        }
        .movies{
            margin-top:vw(52);
            @extend %big ;
        }
    }
}
// 类别标题样式
%big{
    .big-title{
        width: vw(698);
        margin: vw(20) auto vw(38);
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left-title{
            img{
                width: vw(54);
                height: vw(42);
                display: inline-block;
                vertical-align: middle;
            }
            span{
                font-size: vw(30);
                vertical-align: middle;
            }
        }
        .right-title{
            i{
                color: $color;
                font-size: vw(25);
                font-weight: bold;
            }
            span{
                font-size: vw(24);
            }
        }
    }
    .big-pic{
        display: flex;
        justify-content: space-around;
        img{
            width: vw(133);
            height: vw(133);
        }
    }
}